<!DOCTYPE html>
<html lang="ch-Hans">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录</title>
    <link rel="stylesheet" href="../css/login.css">
    <link rel="stylesheet" href="../css/common.css">
    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
    <script src="../js/common.js"></script>
    <script src="/js/axios.js"></script>
    <script src="/js/axiosInstance.js"></script>
</head>

<body>
    <div id="body-container">
        <div id="login-container" class="container">
            <div class="form card">
                <label for="login-username-input">用户名</label>
                <input type="text" name="用户名" id="login-username-input" placeholder="请输入用户名">
                <label for="login-password-input">密码</label>
                <input type="password" name="密码" id="login-password-input" placeholder="请输入密码">
                <div class="error-message">你瞅啥，这是该你看的吗？</div>
                <button class="black-button" title="登录" id="login-button">登录</button>
                <div class="form-footer">
                    <a class="a-text to-register" title="注册">注册</a>
                    <a class="a-text to-reset-password" title="忘记密码">忘记密码</a>
                </div>
            </div>
        </div>
        <div id="register-container" class="container hidden">
            <div class="form card">
                <label for="register-username-input">用户名</label>
                <input type="text" name="用户名" id="register-username-input" placeholder="请输入用户名">
                <label for="register-password-input">密码</label>
                <input type="password" name="密码" id="register-password-input" placeholder="请输入密码">
                <label for="register-email-input">邮箱</label>
                <input type="email" name="邮箱" id="register-email-input" placeholder="请输入邮箱">
                <div class="error-message">你瞅啥，这是该你看的吗？</div>
                <div class="form-footer">
                    <a class="a-text cancel" title="取消">取消</a>
                    <button id="register-button" class="black-button" title="注册">注册</button>
                </div>
            </div>
        </div>
        <div id="code-container" class="container hidden">
            <div class="form card single-input">
                <label for="code-input">验证码已发送至xxxxxxxxxx@xx.xxx，请输入验证码</label>
                <input type="text" name="验证码" id="code-input" placeholder="请输入验证码">
                <div class="error-message">你瞅啥，这是该你看的吗？</div>
                <div class="form-footer">
                    <a class="a-text" title="上一步">上一步</a>
                    <a href="#password-container"><button class="black-button" title="下一步">下一步</button></a>
                </div>
            </div>
        </div>
        <div id="reset-password-container" class="container hidden ">
            <div class="form card single-button">
                <label for="new-password-input">密码</label>
                <input type="password" name="密码" id="new-password-input" placeholder="请输入密码">
                <label for="confirm-password-input">确认密码</label>
                <input type="confirm-password-input" name="密码" id="confirm-password-input" placeholder="请再次输入密码">
                <div class="error-message">你瞅啥，这是该你看的吗？</div>
                <button class="black-button" title="修改密码">修改密码</button>
            </div>
        </div>
        <div id="result-container" class="container">
            <div class="form card single-button">
                <span>成功</span>
                <button class="black-button to-login" title="返回登录">返回登录</button>
            </div>
        </div>
    </div>

    <script src="../js/login.js"></script>
</body>

</html>